import Vue from 'vue'
import Vuex from 'vuex'
import { getItem, setItem } from '@/utils/storage'

Vue.use(Vuex)

// 这样做的目的可以避免访问和获取数据的名字不一致导致的问题
const USER_KEY = 'TOUTIAO_USER'

export default new Vuex.Store({
  state: {
    user: getItem(USER_KEY), // 当前登录用户的登录状态（token等数据）
    cachePages: ['LayoutIndex']

    // 改了下面的本地存储，所以默认是加载本地存储而不是空
    // user: JSON.parse(window.localStorage.getItem('user'))
  },
  mutations: {
    setUser(state, data) {
      state.user = data
      // 为了防止页面刷新数据丢失，我们还需要把数据放到本地存储中，这里仅仅是为了持久化数据
      setItem(USER_KEY, state.user)
      // 存储数据到本地，防止刷新数据丢失
      // window.localStorage.setItem('user', JSON.stringify(state.user))// 注意存储时的语义化和提取时转回
    },
    // 添加缓存页面，没有才添加
    addCachePage(state, pageName) {
      if (state.cachePages.includes(pageName)) { state.cachePages.push(pageName) }
    },
    // 移出缓存页面
    removeCachePage(state, pageName) {
      const index = state.cachePages.indexOf(pageName)
      if (index !== -1) {
        state.cachePages.splice(index, 1)
      }
    }
  },
  actions: {
  },
  modules: {
  }
})
